<template>
	<view>
		<view class="container">
			<view v-if="userInfo.phone" class="row list-item" @click="binDingPhone(0)">
				<text style="font-size: 36rpx;">手机号</text>
				<text style="color: #a7a7a7;margin-left: auto;margin-right: 50rpx;">{{userInfo.phone}}</text>
				<view class="" style="width: 30rpx;height: 30rpx;right: 0rpx;">
					<zywork-icon type="icon-youjiantou1" size="30" color="#afafaf "></zywork-icon>
				</view>
			</view>
			<view v-else class="row list-item" @click="binDingPhone(1)">
				<text style="font-size: 36rpx;">手机号</text>
				<text style="color: #a7a7a7;margin-left: auto;margin-right: 50rpx;">绑定手机号</text>
				<view class="" style="width: 30rpx;height: 30rpx;right: 0rpx;">
					<zywork-icon type="icon-youjiantou1" size="30" color="#afafaf "></zywork-icon>
				</view>
			</view>
			<!-- <view class="row list-item" @click="certification">
				<text style="font-size: 36rpx;">实名认证</text>
				<image src="/static/ttab_authentication@3x.png" mode="widthFix"  style="margin-left: auto;margin-right: 50rpx;width: 300rpx;"></image>
				<view class="" style="width: 30rpx;height: 30rpx;right: 0rpx;">
					<zywork-icon type="icon-youjiantou1" size="30" color="#afafaf "></zywork-icon>
				</view>
			</view> -->
			<view class="row list-item" @click="navTo('/pages/user/my-setting/account-security/account-security')">
				<text style="font-size: 36rpx;">账号安全</text>
				<view class="" style="width: 30rpx;height: 30rpx;margin-left: auto;">
					<zywork-icon type="icon-youjiantou1" size="30" color="#afafaf "></zywork-icon>
				</view>
			</view>
			<view class="row list-item" @click="navTo('/pages/common/common?weburl=https://yunzhuan.zgwlkj.cn/')">
				<text style="font-size: 36rpx;">服务协议</text>
				<view class="" style="width: 30rpx;height: 30rpx;margin-left: auto;">
					<zywork-icon type="icon-youjiantou1" size="30" color="#afafaf "></zywork-icon>
				</view>
			</view>
			<view class="row list-item" @click="navTo('/pages/user/my-setting/about-Us/about-Us')">
				<text style="font-size: 36rpx;">关于我们</text>
				<view class="" style="width: 30rpx;height: 30rpx;margin-left: auto;">
					<zywork-icon type="icon-youjiantou1" size="30" color="#afafaf "></zywork-icon>
				</view>
			</view>
			<view class="row list-item" @click="navTo('/pages/user/my-setting/privacy-Settings/privacy-Settings')">
				<text style="font-size: 36rpx;">隐私设置</text>
				<view class="" style="width: 30rpx;height: 30rpx;margin-left: auto;">
					<zywork-icon type="icon-youjiantou1" size="30" color="#afafaf "></zywork-icon>
				</view>
			</view>
			<view class="row list-item" @click="$refs.alertDialog.open()">
				<text style="font-size: 36rpx;">退出账号</text>
				<view class="" style="width: 30rpx;height: 30rpx;margin-left: auto;">
					<zywork-icon type="icon-youjiantou1" size="30" color="#afafaf "></zywork-icon>
				</view>
			</view>
		</view>
		<uni-popup ref="popup" >
			<view class="column align-items-center popup-item" style="width: 690rpx;background-color: #FFFFFF;border-radius: 35rpx;">
				<view class="" style="border-bottom: solid 1rpx #eee;">
					支付宝认证
				</view>
				<view class="" style="border-bottom: solid 1rpx #eee;">
					身份证认证
				</view>
				<view class="" @click="cancel">
					取消
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="alertDialog" type="dialog" @maskClick="$refs.alertDialog.close()">
			<uni-popup-dialog type="warning" title="提示" :buttonArr="['取消','确定']"  content="确定要退出账号嚒ヾ(•ω•`。)" @confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>
<script>
	import {mapMutations} from 'vuex';
	export default {
		data() {
			return {
				userInfo:{}
			};
		},
		onShow() {
			this.userInfo = uni.getStorageSync(this.$util.USER_INFO)
			console.log(this.userInfo)
			if(this.userInfo==null){
				this.dialogConfirm()
			}
			if(this.userInfo.phonenumber){
				this.userInfo.phone = this.$util.noPassByMobile(this.userInfo.phonenumber+"")
			}
		},
		methods:{
			...mapMutations(['logout']),
			navTo(url){
				uni.navigateTo({
					url:url
				})
			},
			binDingPhone(index){
				if(index===0){
					this.navTo('/pages/user/my-setting/verify-phone/verify-phone')
				}else if(index===1) {
					if(this.userInfo.loginType === 'apple'){
						this.navTo('/pages/login/binding-phone/binding-phone?type='+this.userInfo.loginType)
					}else {
						this.navTo('/pages/user/my-setting/update-Phone/update-Phone')
					}
				}
				
			},
			certification(){
				this.$refs.popup.open()
			},
			cancel(){
				this.$refs.popup.close()
			},
			dialogConfirm() {
				console.log('确定退出')
				if(this.$refs.alertDialog){
					this.$refs.alertDialog.close()
				}
				this.logout();
				uni.setStorageSync(this.$util.AUTH,false)
				uni.removeStorageSync(this.$util.USER_TOKEN_KEY)
				uni.setStorageSync(this.$util.HAS_USER_INFO,false)
				plus.runtime.restart();
				// uni.reLaunch({
				// 	url:"/pages/login/login"
				// })
			},
			dialogClose() {
			},
		}
	}
</script>

<style lang="scss">
	
	.container{
		padding: 20rpx 30rpx;
		.list-item{
			padding: 30rpx 0rpx;
			border-bottom: solid 1rpx #eee;
			align-items: center;
		}
	}
	
	.popup-item{
		view{
			width: 100%;
			text-align: center;
			padding: 50rpx 0rpx;
		}
	}
	
</style>
